<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<% 
	String path = request.getContextPath();
	pageContext.setAttribute("path", path);
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${path}/js/easyui/jquery.min.js"></script>
<script type="text/javascript" src="${path}/js/echarts.min.js"></script>
<script type="text/javascript" src="${path}/js/chartshow.js"></script>

<title>显示图表信息</title>
</head>
<body>
		<div id="pie" style="width: 600px;height:400px;"/>
		<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('pie'));
myChart.showLoading();
$.getJSON('getMovieCount.do').done(function (data) {
    // 填入数据
    
    myChart.hideLoading();
    myChart.setOption(
    		{
    		    title : {
    		        text: '采集分布',
    		        x:'center'
    		    },
    		    tooltip : {
    		        trigger: 'item',
    		        formatter: "{a} <br/>{b} : {c} ({d}%)"
    		    },
    		    legend: {
    		        orient: 'vertical',
    		        left: 'left',
    		        data: data.items
    		    },
    		    series : [
    		        {
    		            name: '采集量',
    		            type: 'pie',
    		            radius : '55%',
    		            center: ['50%', '60%'],
    		            data:data.data,
    		            itemStyle: {
    		                emphasis: {
    		                    shadowBlur: 10,
    		                    shadowOffsetX: 0,
    		                    shadowColor: 'rgba(0, 0, 0, 0.5)'
    		                }
    		            }
    		        }
    		    ]
    		}
    
    )
});
</script>
</body>
</html>